<template>
  <el-dialog title="关联项目" :visible.sync="dialogVisible" width="70%">
    <el-table v-loading="loading" :data="list">
      <el-table-column width="55" align="center">
        <template slot-scope="scope">
          <el-radio :label="scope.row.extractId" v-model="selected" @change="radioChange(scope.row)">
            <span></span>
          </el-radio>
        </template>
      </el-table-column>
      <el-table-column label="项目名称" align="left" prop="extractItem" />
      <el-table-column label="经办人" align="left" prop="extractCharge" />
      <el-table-column
        label="中介机构服务费（万元）"
        align="left"
        prop="maxPrice"
      />
      <el-table-column label="创建时间" align="center" prop="createTime" />
      <el-table-column
        label="抽取库"
        align="left"
        width="200"
        prop="unitTypeName"
      />
      <el-table-column
        label="是否正常完成"
        align="center"
        prop="extractApproveStatus"
      >
        <template> 项目完成 </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="confirm">确 定</el-button>
      <el-button @click="dialogVisible = false">取 消</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { listExtract } from "@/api/unit/extract";

export default {
  props: ["visible"],
  computed: {
    dialogVisible: {
      get() {
        return this.visible;
      },
      set(value) {
        this.$emit("update:visible", value);
      },
    },
  },
  data() {
    return {
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        extractApproveStatus: "8",
        userId: "",
      },
      loading: false,
      list: [],
      total: 0,
      selected: "",
      currentRow: {}
    };
  },
  methods: {
    getList() {
      listExtract(this.queryParams).then((res) => {
        this.list = res.rows;
        this.total = res.total;
      });
    },
    radioChange(row) {
        this.currentRow = row
    },
    confirm() {
      this.$emit("getRowId", this.currentRow);
      this.dialogVisible = false;
    },
  },
  created() {
    this.queryParams.userId = this.$store.getters.userId;
    this.getList();
  },
};
</script>

<style>
</style>